<template>
  <!-- 学生救助公益捐赠确认表 -->
  <div style="margin-left: 100px; margin-right: 120px">
    <!-- 确认表单信息 -->
    <div class="Confirmation_form">
      <h3 style="text-align: center; margin-top: 2vh">
        流浪的梦公益捐赠确认表
      </h3>
      <div class="text_info">
        <span>捐赠订单编号:{{basicInfo.accountNumber}}</span>
        <br />
        <span>申请时间:{{basicInfo.createTime}}</span>
        <br />
        <span>申请人编号:{{basicInfo.recipientId}} </span>
        <br />
        <span>身份证号:{{basicInfo.idNumber}}</span>
        <br />
        <span>学段:{{basicInfo.learningSection}}</span>
        <br />
        <span>就读学校:{{basicInfo.school}}</span>
        <br />
        <span>收款账号:{{basicInfo.accountNumber}} </span>
        <br />
        <span>收款地址:{{basicInfo.receivingAddress}}</span>
        <br />
        <span>目标金额:￥{{basicInfo.targetMoney}}</span>
      </div>
      <img :src="ensureImgSrc[basicInfo.status]" alt="" />
    </div>
    <span style="display: inline-block; margin-left: 15vw; color: red"
      >*
      点击确认后待后台管理员审核，一个工作日之后请再次查看（请记住申请人编号，方便后续操作！）</span
    >
    <el-row style="margin-left: 30vw; margin-top: 4vh">
      <el-button type="warning" round @click="toRouter('/home')">确定</el-button>
      <el-button type="danger" round @click="toRouter('/profile')">返回</el-button>
    </el-row>
  </div>
</template>
<script>
export default {
  name: "EnSureInfo",
  props: {
    basicInfo: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      srcIndex: 0,
      ensureImgSrc: [
        require("assets/image/charity/待审核.png"),
        require("assets/image/charity/审核通过.png"),
        require("assets/image/charity/审核未通过.png")
      ]
    };
  },
  methods: {
    //路由跳转
    toRouter(path) {
      this.$router.push(path);
    }
  }
};
</script>
<style>
.step {
  margin-right: 50px;
  border: 2px solid gray;
  padding: 10px;
  border-radius: 5px;
  background-color: rgb(236, 196, 163);
}
.Confirmation_form {
  width: 40vw;
  border: 1px solid black;
  margin-left: 16vw;
  margin-top: 2vh;
}
.text_info {
  /* text-align: center; */
  margin-top: 3vh;
  margin-left: 2vw;
}
.text_info > span {
  line-height: 1.5em;
}
.Confirmation_form > img {
  width: 20vw;
  height: 25vh;
  margin-left: 20vw;
  margin-top: -18vh;
}
</style>
